<template>
    <div>
         <el-table highlight-current-row @current-change="handleCurrentChange"  v-loading="loading" :data="tableData" border style="width: 100%">

                  <el-table-column
                        type="index"
                        label="序号"
                        width="50">
                      </el-table-column>
               <template v-for="(item,index) in tableTitle" >


                    <el-table-column :width="item.width" v-if="item.prop == 'member_info.gender'" :prop="item.prop" :label="item.label" :key="index">
                        <template slot-scope="scope">
                          <div v-if="scope.row.member_info">{{ ($baseBai['gender'].find(v=>v.value==scope.row.member_info.gender)).label }}</div>
                            <!-- <div v-if="scope.row.member_info">{{ $baseBai['gender'][scope.row.member_info.gender-1].label }}</div> -->
                        </template>
                      </el-table-column>
                         <el-table-column :width="item.width" v-else-if="item.prop == 'pay_status'" :prop="item.prop" :label="item.label" :key="index">
                        <template slot-scope="scope">
                            <div v-if="scope.row.pay_status">{{ $baseBai['yibaoInfo']['pay_status'].find(v=>v.value==scope.row.pay_status).label}}</div>
                        </template>
                      </el-table-column>
                      <el-table-column :width="item.width" v-else-if="item.prop == 'status'" :prop="item.prop" :label="item.label" :key="index">
                        <template slot-scope="scope">
                            <span :class="classStatus[scope.row.status-1]"  >{{ $baseBai['mzsf']['gh_zt'].find(v=>v.value==scope.row.status).label }}</span>
                        </template>
                      </el-table-column>
                          <el-table-column width="120" v-else-if="item.prop == 'payment'" :prop="item.prop" :label="item.label" :key="index">
                        <template slot-scope="scope">
                      <!-- :class="classPayment[scope.row.payment-1]" -->
                           <div v-if="(scope.row.payment instanceof Array)">
                                <div v-for="(item,paymentindex) in scope.row.payment" :key="'payment'+paymentindex">
                                    <p> {{($baseBai['payment'].find(v=>v.value==item.payment)).label }}：{{item.money }}</p>

                                </div>
                           </div>
                           <div v-else-if="scope.row.payment" :class="classPayment[scope.row.payment-1]" >{{ ($baseBai['payment'].find(v=>v.value==scope.row.payment)).label }}</div>
                        </template>
                      </el-table-column>

                      <el-table-column :width="item.width" v-else-if="item.prop == 'look_type'" :prop="item.prop" :label="item.label" :key="index">
                        <template slot-scope="scope">
                            <span v-if="scope.row.look_type!=0" :class="classStatus[scope.row.look_type-1]">{{ ($baseBai['mzsf']['gh_cfz'].find(v=>v.value==scope.row.look_type)).label }}</span>
                        </template>
                      </el-table-column>

                            <el-table-column :width="item.width" v-else-if="item.prop == 'member.gender'" :prop="item.prop" :label="item.label" :key="index">
                        <template slot-scope="scope">
                            <span>{{ $baseBai['gender'].find(v=>v.value==scope.row.member.gender).label }}</span>
                        </template>
                      </el-table-column>

                    <el-table-column
                  :width="item.width"
                  v-else-if="item.prop == 'medical_record.diagnosis'"
                  :prop="item.prop"
                  :label="item.label"
                  :key="index"
                >
                  <template slot-scope="scope">
                    <span v-if="scope.row.medical_record">

                        <span ></span>
                        <span  v-for="(item,diag_index) in scope.row.medical_record.diagnosis" :key='diag_index'>
                          {{item.name}}
                        </span>
                    </span>
                  </template>
                </el-table-column>


                      <el-table-column :width="item.width" v-else :prop="item.prop" :label="item.label" :key="index"> </el-table-column>
               </template>
            <el-table-column label="操作" width="250" fixed="right">
              <template slot-scope="scope" >
                <el-dropdown
                  class="tableMore"
                  split-button
                  type="primary"
                  size="12"
                  @command="handleClick"
                v-if="activeName=='1'"
                >
                  更多
                  <el-dropdown-menu slot="dropdown" >
                    <!-- <el-dropdown-item :command="scope.row" type="1">修改</el-dropdown-item> -->
                    <el-dropdown-item :command="scope.row" type="2">退号</el-dropdown-item>
                    <!-- <el-dropdown-item :command="scope.row" type="3">预存</el-dropdown-item> -->
<!--                    <el-dropdown-item :command="scope.row" type="4" >打印挂号单</el-dropdown-item>-->
<!--                    <el-dropdown-item :command="scope.row" type="7" >久</el-dropdown-item>-->
                    <el-dropdown-item :command="scope.row" type="6" >打印收费单</el-dropdown-item>
                  </el-dropdown-menu>

                </el-dropdown>
                <div    v-if="activeName=='2'">
                   <el-button
                   v-if="thatF.pay_status==1"
                  size="mini"
                  type="primary"
                  @click="handleEdit(scope.$index, scope.row,1)">收费</el-button>
                   <el-button
                   v-if="thatF.pay_status==2||thatF.pay_status==4"
                  size="mini"
                  type="danger"
                  @click="handleEdit(scope.$index, scope.row,3)">退费</el-button>
                            <el-button
                   v-if="thatF.pay_status!==1"
                  size="mini"
                  type="info"
                  @click="handleEdit(scope.$index, scope.row,5)">明细</el-button>
                    <el-button
                   v-if="thatF.pay_status==3"
                  size="mini"
                  type="warning"
                  @click="handleEdit(scope.$index, scope.row,4)">作废</el-button>
                  <el-button

                  v-if="thatF.pay_status==1"
                    size="mini"
                   style="margin-top:10px"
                    type="danger"
                    @click="handleEdit(scope.$index, scope.row,2)">删除</el-button>
                        <el-button
                  v-if="thatF.pay_status==2"
                   style="margin-top:10px"
                    size="mini"
                    type="success"
                    @click="handleEdit(scope.$index, scope.row,6)">打印收费单</el-button>
                  </div>
              </template>


            </el-table-column>
          </el-table>


            <el-dialog title="退号" :modal-append-to-body="false" :visible.sync="show_backNumber" :destroy-on-close="true">

                   <backNumber :backNumberData="backNumberData" :thatF="this"  ></backNumber>
            </el-dialog>
                 <el-dialog title="打印" :modal-append-to-body="false" :visible.sync="show_dayin" :destroy-on-close="true">
                  <billChange :id='id'></billChange>

            </el-dialog>
            <el-dialog title="旧" :modal-append-to-body="false" :visible.sync="show_dayin1" :destroy-on-close="true">

                   <guahao :id='id'></guahao>
            </el-dialog>
              <el-dialog title="打印" :modal-append-to-body="false" :visible.sync="showshouju" v-if="showshouju" :destroy-on-close="true">

                   <shouju :id='id' :type="type"></shouju>
            </el-dialog>
             <el-dialog :title="dialogTitle" :modal-append-to-body="false" v-if="show_charge"  :visible.sync="show_charge" :close-on-click-modal="false" :destroy-on-close="true">

                   <charge :chargeData="chargeData"  :thatF="this"  :chargeDataArry="chargeDataArry" ></charge>
            </el-dialog>


    </div>
</template>

<script>
import { Switch } from 'element-ui'
import backNumber from './backNumber'
import charge from './charge'
import shouju from './shouju.vue'
import billChange from './billChange.vue'
import guahao from './guahao.vue'
import { mapState,mapActions } from "vuex";
export default {
   props:['tableTitle','tableData','loading','activeName','thatF'],
    data() {
        return {
          dialogTitle:'',
          show_backNumber:false,
          show_charge:false,
          show_dayin:false,
          show_dayin1:false,
          showshouju:false,
          backNumberData:'',
          chargeData:'',
          chargeDataArry:[],
          dialogType:'',
          id:'',
          item2:[],
          classStatus:['on on1','on on2','on on3','on on4'],
          classPayment:['on on_pay1','on on_pay2','on on_pay3','on on_pay4','on on_pay5','on on_pay6'],
          type:1,
        }
    },
    components: {
   backNumber,
   charge,
   shouju,
   guahao,
   billChange

  },

    methods:{
       ...mapActions([
           'dictBai/getDict_dataDictIndex',
      	]),
      more(item){
        console.log("item",item)
      },
      handleCurrentChange(item){
        console.log("item1",item)
        this.thatF.yibao.selectItem=item;
      },
      handleClick(...item){


          switch (item[1].$attrs.type) {
            case '1':
                   this.$emit('dialogStatus');
              break;
            case '2':

                  // if(item[0].status==2){

                  //    return  this.$message.error('已开立处方，不允许退号');
                  // }else  if(item[0].status==3 ){

                  //    return  this.$message.error('已开立处方，不允许退号');
                  // }else  if(item[0].status==4 ){

                  //    return  this.$message.error('该信息已经退号');
                  // }else if(item[0].status==1){
              //           this['dictBai/getDict_dataDictIndex']({group_id:'71'}).then(res=>{

              //                      if(type==2){
              //                       this.params.page=1;
              //                       this.getList()
              //                     }
              //                     this.showAddUpdate=!this.showAddUpdate;

              // })

                    this['_API'].getRegisterShow({id:item[0].id}).then(res=>{
                            if(res.code==200){
                                  this.chargeData=item[0];
                                  console.log("item", this.chargeData)
                                  this.backNumberData=res.data
                                    // this.backNumberData.fee_items= JSON.parse(this.backNumberData.fee_items)


                                    this['dictBai/getDict_dataDictIndex']({group_id:'71'}).then(res=>{

                                                       this.show_backNumber=true;

                                  })


                            }
                    })


                  // }
              break;
              case '3':

              break;
              case '4':
                this.id=item[0].id
                // console.log(item[0])
                this.show_dayin=true
              break;
              case '6':
                    this.type=1;
                    this.id=item[0].id
                    this.showshouju=true
              break;
              case '7':
                this.id=item[0].id
                // console.log(item[0])
                this.show_dayin1=true
              break;
            default:
              break;
          }
      },
      handleEdit(...item){
         console.log(item)

          if(item[2]==1){

            //收费
            this.item2=item
            this['_API'].getClinic_feeFeeFeeItem({id:item[1].id}).then(res=>{
                                      if(res.code==200){
                                          this.dialogTitle='收费'
                                        this.chargeData=item[1];
                                        this.chargeDataArry=res.data;

                                        this.show_charge=true;
                                      }
                              })

          }else if(item[2]==2){

             //删除




              this.$confirm('确定删除吗？删除后的数据无法恢复', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
                }).then(() => {
                      this['_API'].getClinic_feeFeeDel({id:item[1].id}).then(res=>{
                            if(res.code==200){
                                  this.$message({
                                    message: res.message,
                                    type: 'success'
                                });
                                this.thatF.params.page=1;
                                 this.thatF.getClinic_feeFeeIndex()
                            }
                    })
                })


          }else if(item[2]==3){


                     //退费

            this['_API'].getClinic_feeFeeFeeItem({id:item[1].id}).then(res=>{
                                      if(res.code==200){
                                          this.dialogTitle='退费'
                                        this.chargeData=item[1];
                                        this.chargeDataArry=res.data;
                                        this.show_charge=true;
                                      }
                              })

            //  this.$confirm('确定要对患者['+item[1].member.name+']退费？退费金额：'+item[1].should_amount, '提示', {
            //       confirmButtonText: '确定',
            //       cancelButtonText: '取消',
            //       type: 'warning'
            //     }).then(() => {


            //           this['_API'].getClinic_feeFeeBack({id:item[1].id}).then(res=>{
            //                 if(res.code==200){
            //                       this.$message({
            //                         message: res.message,
            //                         type: 'success'
            //                     });
            //                       this.thatF.params.page=1;
            //                      this.thatF.getClinic_feeFeeIndex()
            //                 }
            //         })
            //     })


              //退费
          }else if(item[2]==4){

             this.$confirm('确定要作废此条信息吗', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
                }).then(() => {


                      this['_API'].getClinic_feeFeeCancel({id:item[1].id}).then(res=>{
                            if(res.code==200){
                                  this.$message({
                                    message: res.message,
                                    type: 'success'
                                });
                                  this.thatF.params.page=1;
                                 this.thatF.getClinic_feeFeeIndex()
                            }
                    })
                })


              //退费
          }else if(item[2]==5){
              //明细

            this['_API'].getClinic_feeFeeFeeItem({id:item[1].id}).then(res=>{
                                      if(res.code==200){
                                        this.chargeData=item[1];
                                        if(this.thatF.pay_status==3){
                                          console.log("res.data.find(v=>v.status==5)",res.data.filter(v=>v.status==5))
                                          this.chargeDataArry= res.data.filter(v=>v.status==5)
                                        }else{
                                              this.chargeDataArry=res.data;
                                        }

                                        this.dialogTitle='明细'
                                        this.show_charge=true;
                                      }
                              })
          }else if(item[2]==6){
              //收费
              this.type=2;
            this.id=item[1].id
            this.showshouju=true

          }
      },

    },

}
</script>
<style lang='scss' scoped>


// /deep/ .el-table td, .el-table th.is-leaf{
//    text-align: center;
// }

.tableMore {
  /deep/ .el-button--primary {
    color: black;
    background-color: initial;
    border-color: #e2e2e2;
  }
}
.el-dropdown-link {
  cursor: pointer;
  color: #409eff;
}
.el-icon-arrow-down {
  font-size: 12px;
}
.on{
      display: inline-block;

    padding: 0px 10px;
    border-radius: 3px;
    font-size: 12px;
    color: white;
}
.on1{
   background: #02bf6b;
}
.on2{
   background: #c0392b;
}
.on3{
   background: #2980b9;
}
.on4{
   background: #e74c3c;
}
.on_pay1{

   background:  #f39c12;
}
.on_pay2{

   background:  #02bf6b;
}
.on_pay3{

   background:  #2980b9;
}
.on_pay4,.on_pay5,.on_pay6{

   background:  #2980b9;
}

/deep/ .el-table__body tr.current-row>td{
  background-color: #409EFF;
}
.el-button+.el-button{
  margin-left: 0px;
}
</style>
